/*
 * @Author: taoyuqing
 * @Date: 2023-01-05 00:46:25
 * @Description: 
 */

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:spree/utils/utils.dart';
import 'package:spree/widgets/common_container.dart';
import 'package:spree/widgets/copty_input.dart';
import 'package:spree/widgets/vip_content_box.dart';
import 'package:spree/widgets/vip_rectangle_box.dart';

class Perfernal extends StatefulWidget {
  Perfernal({Key? key}) : super(key: key);

  @override
  State<Perfernal> createState() => _PerfernalState();
}

class _PerfernalState extends State<Perfernal> {
  List _leftRule = [
    'Cumulative Deposit Users',
    '0-999\nPeople',
    '1000-2999\nPeople',
    '3000-4999\nPeople',
    'More than 5000\nPeople'
  ];
  List _rightRule = [
    'Bonus',
    'R\$ 9\nPer People',
    'R\$ 10\nPer People',
    'R\$ 12\nPer People',
    'R\$ 15\nPer People',
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: SvgPicture.asset('images/BETSPREELOGO.svg'),
      ),
      body: CommonContainer(
        child: ListView(
          padding: EdgeInsets.only(top: 20),
          children: [
            VipContentBox(
              padding:
                  EdgeInsets.only(left: 20, right: 20, top: 20, bottom: 20),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Image.asset(
                        'images/Vector.png',
                        width: 18,
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 20),
                        child: Text(
                          'Invite a Partner',
                          style: TextStyle(
                              color: Color(0xffFFED4A),
                              fontSize: 16,
                              fontWeight: FontWeight.w800),
                        ),
                      )
                    ],
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 20),
                    child: Text(
                      'Invite URL:',
                      style: TextStyle(
                          color: Colors.white, fontWeight: FontWeight.w800),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 10),
                    child: CopyInput(
                      copyContentColor: Color(0xff362B76),
                      copyContent:
                          'https://betdino.io?referralcode=62f14645860e2bee6be9f840',
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 20),
                    child: Text(
                      'Copy the invite Code:',
                      style: TextStyle(
                          color: Colors.white, fontWeight: FontWeight.w800),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 10),
                    child: CopyInput(
                      copyContentColor: Color(0xff362B76),
                      copyContent: '62f14645860e2bee6be9f840',
                    ),
                  ),
                ],
              ),
            ),
            Column(
              children: _imagesItem(),
            ),
            Container(
              margin: EdgeInsets.only(top: 20),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    'HOW DOES THE INVITATION BONUS WORK?',
                    style: TextStyle(
                        color: Color(0xFFFFED4A),
                        fontSize: 16,
                        fontWeight: FontWeight.w800),
                  ),
                  Container(
                    padding: EdgeInsets.all(
                      10,
                    ),
                    child: Text(
                      'Each deposit user can receive at least R\$8 for each invite. The more people you invite, the greater the invite bonus for the corresponding level. For specific rules, see the table below',
                      style: TextStyle(color: Color(0xFFC9C8FF)),
                    ),
                  ),
                ],
              ),
            ),
            VipContentBox(
              padding: EdgeInsets.all(20),
              width: Utils().getScreenWidth(context),
              child: Container(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      width: (Utils().getScreenWidth(context) - 80) / 2,
                      child: _createRule(_leftRule),
                    ),
                    Container(
                      width: (Utils().getScreenWidth(context) - 80) / 2,
                      child: _createRule(_rightRule),
                    ),
                  ],
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.only(top: 20),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    'HOW TO GET COMMISSION ON YOUR BETS',
                    style: TextStyle(
                        color: Color(0xFFFFED4A),
                        fontSize: 16,
                        fontWeight: FontWeight.w800),
                  ),
                  Container(
                    padding: EdgeInsets.all(
                      10,
                    ),
                    child: Text(
                      'This will be your long-term income and you will receive a different percentage of commission each time a player you invite places a bet.',
                      style: TextStyle(color: Color(0xFFC9C8FF)),
                    ),
                  ),
                ],
              ),
            ),
            Column(
              children: _imagesItem(),
            ),
          ],
        ),
      ),
    );
  }

  List<Widget> _imagesItem() {
    List images = [
      'images/monthly-revenue-goals.png',
      'images/invitation-bonus.png',
      'images/betting-commission.png'
    ];
    return images.map((e) {
      return Container(
        margin: EdgeInsets.only(top: 20),
        child: Image.asset(e),
      );
    }).toList();
  }

  Widget _createRule(List rules) {
    List<Widget> leftWidget = rules.map((e) {
      return VipRectangleBox(
        height: 60,
        width: Utils().getScreenWidth(context),
        alignment: Alignment.center,
        margin: EdgeInsets.only(top: 10),
        child: Text(
          e,
          style: TextStyle(color: Colors.white),
        ),
      );
    }).toList();
    Widget column = Column(
      children: leftWidget,
    );
    return column;
  }
}
